            <div class="row" ng-controller="PeopleCtrl as vm">
                <div class="col-md-12">
<div class="box box-primary">
              <div class="box-header with-border">
                <h3 class="box-title">GC People Planning</h3> 
                <small>(Last Updated: {{vm.lastUpdated | date:'yyyy-MM-dd HH:mm'}} by {{vm.lastUpdateBy}})  <span class="label label-danger" style="font-size:15px">{{vm.msg}}</span></small>
                <div class="pull-right">
                   <button ng-disabled="vm.loading" class="btn btn-info btn-xs" ng-click="vm.saveTable()">Update</button>
                </div>
              </div>
              <div class="box-body table-responsive no-padding" style="height:1260px">
                  <table class="table table-hover">
                    <tr>
                      <th>Postion</th>
                      <th width="190px">Name/Vacant</th>
                      <th width="190px">Vacant Date</th>
                      <th>Comment</th>
                      <th width="190px">Diversity</th>
                    </tr>
                    <tr ng-repeat="people in vm.gcPeople">
                      <td>{{people.position}}</td>
                      <td ng-switch='people.vacantStatus'>
                      
                        <div ng-switch-when="warning"><span class="label label-warning yellow-vacant">Vacant</span></div>
                        <div ng-switch-when="danger"><span class="label label-danger ">Vacant</span></div>
                        <div ng-switch-when="purple"><span class="label bg-purple">Vacant</span></div>
                        <div ng-switch-when="ok"><span class="label label-success">Vacant</span></div>
                        <div ng-switch-default><input type="text" class="form-control" ng-model="people.name"/></div>
                      </td>
                      <td>
                        <!-- <input type="text" ng-model="people.vacantDate" ng-change="vm.checkVacant(people)"> -->
                        <span class="input-group">
                          <input type="text" class="form-control" uib-datepicker-popup ng-model="people.vacantDate" is-open="people.opened" datepicker-options="dateOptions"  ng-required="true" close-text="Close"  ng-change="vm.checkVacant(people)" readonly/>
                          <span class="input-group-btn">
                            <button type="button" class="btn btn-default" ng-click="open(people,$event)" ng-disabled="people.vacantStatus!='danger' && people.vacantStatus!='warning' && people.vacantStatus!='purple' && people.name!=''&& people.name!=' '"><i class="glyphicon glyphicon-calendar"></i></button>
                          </span> 
                        </span>
<!-- <div date-picker></div> -->
                        </td>
                      <td><input class="form-control" type="text" ng-model="people.comment" ng-change="vm.checkVacant(people)" /></td>
                      <td><select ng-disabled="!(people.vacantStatus!='danger' && people.vacantStatus!='warning' && people.vacantStatus!='purple' && people.name!=''&& people.name!=' ')" class="form-control" ng-options="div for div in vm.diversityOptions track by div" ng-model="people.diversity">
                        <option value=''></option>
                      </select>
                       </td>
                    </tr>
                  
                  </table>
                </div><!-- /.box-body -->
            </div><!-- /.box -->
                </div>
               
          </div>